<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>点击地图添加marker</title>
</head>
<script charset="utf-8"
    src="https://map.qq.com/api/gljs?v=1.exp&key=JXZBZ-YGFLS-5ODOI-6UZZI-5MJ56-BJBAH"></script>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<style type="text/css">
    html,
    body {
        height: 100%;
        margin: 0px;
        padding: 0px;
    }

    #container {
        width: 100%;
        height: 100%;
    }
</style>

<body>
    <div id="container"></div>
    <script>
        var center = new TMap.LatLng(39.984104, 116.307503);//设置中心点坐标
        //初始化地图
        var map = new TMap.Map("container", {
            center: center
        });

        //初始化marker图层
        var markerLayer = new TMap.MultiMarker({
            id: 'marker-layer',
            map: map
        });
		
		markerLayer.add([{
			"id": "1",   //点标记唯一标识，后续如果有删除、修改位置等操作，都需要此id
			"styleId": 'myStyle',  //指定样式id
			"position": new TMap.LatLng(39.954104, 116.357503),  //点标记坐标位置
			"properties": {//自定义属性
				"title": "marker3"
				}
			}
		]);

        //监听点击事件添加marker
        map.on("click", (evt) => {
			markerLayer.updateGeometries([
				{
				 "styleId":"myStyle",
				 "id": "1",
				 "position": evt.latLng,
				}
			]); 
			console.log(evt.latLng);
			//console.log(markerLayer.getGeometries()[0].position.toString());
			jQuery.getScript("https://apis.map.qq.com/ws/geocoder/v1/?location=" + evt.latLng.lat + ',' + evt.latLng.lng + "&key=JXZBZ-YGFLS-5ODOI-6UZZI-5MJ56-BJBAH&output=jsonp&&callback=getaddress");
        });
		function getaddress(res){
			console.log(res);
		}
    </script>
</body>

</html>